<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>首页</title>
		<link rel="stylesheet" type="text/css" href="css/index.css" />
		<link rel="stylesheet" type="text/css" href="css/index_center.css"/>
		<!-- 引入插件 -->
				<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>
		<script src="js/index.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<!-- 用div存放网页内容，设置宽度，水平居中 -->
		 <div id="container">
		 	<div id="header">
				<div id="header-top">
					<div id="logo">
						<a href="#"></a>
					</div>
					<div id="car">
						<!-- 购物车 -->
						<ul>
							<li><a href="#" class="pic"></a></li>
							<li><a href="#" class="text">购物车</a></li>
							<li><a href="#" class="pic pic2"></a></li>
							<li><a href="#" class="text">帮助中心</a></li>
							<li><a href="#" class="pic pic3"></a></li>
							<li><a href="#" class="text">加入收藏</a></li>
							<li><a href="#" class="pic pic4"></a></li>
							<li><a href="#" class="text">设为首页</a></li>
							<li><a href="#" class="pic pic5">注册</a></li>
							<li><a href="#" class="pic pic5">登录</a></li>
						</ul>
					</div>
					<div id="welcome">
						<!-- 欢迎文字 -->
						<span>欢迎来</span>
						<span id="time">2020-09-23</span>
					</div>
				</div>
			<div id="header-nav">
				<!-- 导航部分 -->
				<ul class="nav">
					<li><a href="">首　　页</a></li>
					<li><a href="">家用电器</a></li>
					<li><a href="">手机数码</a></li>
					<li><a href="">日用百货</a></li>
					<li><a href="">书　　籍</a></li>
					<li><a href="">帮助中心</a></li>
					<li><a href="">全球资讯</a></li>
					<li><a href="">免费开店</a></li>
				</ul>
				<ul class="soso">
					<li><input type="text" id="content" value="" /></li>
					<li><input type="button" onclick="soso()" id="" value="" /></li>
				</ul>
			</div>
		 </div>
		<!-- 中间部分 -->
			<div id="center">
			  <div id="center_left">
				  <p class="space"></p>
				  <div class="content">
					  <h3><a href="#">家用电器 </a></h3>
					  <ul>
					  	<li><a href="#">大家电</a></li>
					  	<li><a href="#">洗衣机</a></li>
					  	<li><a href="#">平板电视</a></li>
					  	<li><a href="#">电热水器</a></li>
					  	<li><a href="#">家庭音响</a></li>
					  	<li><a href="#">热水器</a></li>
					  	<li><a href="#">空调冰箱</a></li>
					  	<li><a href="#">冷柜</a></li>
					  	<li><a href="#">DVD</a></li>
					  	<li><a href="#">电视附件</a></li>
					  	<li><a href="#">电燃气灶</a></li>
					  	<li><a href="#">家电下乡</a></li>
					  	<li><a href="#">家电服务</a></li>
					  	<li><a href="#">电饭煲</a></li>
					  	<li><a href="#">摄像机</a></li>
					  </ul>
					  
				  </div>
				  <div class="content">
				  					  <h3><a href="#">家用电器 </a></h3>
				  					  <ul>
				  					  	<li><a href="#">大家电</a></li>
				  					  	<li><a href="#">洗衣机</a></li>
				  					  	<li><a href="#">平板电视</a></li>
				  					  	<li><a href="#">电热水器</a></li>
				  					  	<li><a href="#">家庭音响</a></li>
				  					  	<li><a href="#">热水器</a></li>
				  					  	<li><a href="#">空调冰箱</a></li>
				  					  	<li><a href="#">冷柜</a></li>
				  					  	<li><a href="#">DVD</a></li>
				  					  	<li><a href="#">电视附件</a></li>
				  					  	<li><a href="#">电燃气灶</a></li>
				  					  	<li><a href="#">家电下乡</a></li>
				  					  	<li><a href="#">家电服务</a></li>
				  					  	<li><a href="#">电饭煲</a></li>
				  					  	<li><a href="#">摄像机</a></li>
				  					  </ul>
				  					  
				  </div>
				  <div class="content">
				  					  <h3><a href="#">家用电器 </a></h3>
				  					  <ul>
				  					  	<li><a href="#">大家电</a></li>
				  					  	<li><a href="#">洗衣机</a></li>
				  					  	<li><a href="#">平板电视</a></li>
				  					  	<li><a href="#">电热水器</a></li>
				  					  	<li><a href="#">家庭音响</a></li>
				  					  	<li><a href="#">热水器</a></li>
				  					  	<li><a href="#">空调冰箱</a></li>
				  					  	<li><a href="#">冷柜</a></li>
				  					  	<li><a href="#">DVD</a></li>
				  					  	<li><a href="#">电视附件</a></li>
				  					  	<li><a href="#">电燃气灶</a></li>
				  					  	<li><a href="#">家电下乡</a></li>
				  					  	<li><a href="#">家电服务</a></li>
				  					  	<li><a href="#">电饭煲</a></li>
				  					  	<li><a href="#">摄像机</a></li>
				  					  </ul>
				  					  
				  </div>
				  <div class="content">
				  					  <h3><a href="#">家用电器 </a></h3>
				  					  <ul>
				  					  	<li><a href="#">大家电</a></li>
				  					  	<li><a href="#">洗衣机</a></li>
				  					  	<li><a href="#">平板电视</a></li>
				  					  	<li><a href="#">电热水器</a></li>
				  					  	<li><a href="#">家庭音响</a></li>
				  					  	<li><a href="#">热水器</a></li>
				  					  	<li><a href="#">空调冰箱</a></li>
				  					  	<li><a href="#">冷柜</a></li>
				  					  	<li><a href="#">DVD</a></li>
				  					  	<li><a href="#">电视附件</a></li>
				  					  	<li><a href="#">电燃气灶</a></li>
				  					  	<li><a href="#">家电下乡</a></li>
				  					  	<li><a href="#">家电服务</a></li>
				  					  	<li><a href="#">电饭煲</a></li>
				  					  	<li><a href="#">摄像机</a></li>
				  					  </ul>
				  					  
				  </div>
			  </div>
			  <div id="center_mid">
				  <!-- 滚动图 -->
				  <div id="top-ad">
				  				  <ul id="imgs">
				  				  	<li><a href="#"><img  src="img/ad-02.jpg"></a></li>
				  				  	<li><a href="#"><img  src="img/ad-01.jpg"></a></li>
				  				  	<li><a href="#"><img  src="img/ad-03.jpg"></a></li>
				  					<li><a href="#"><img  src="img/ad-04.jpg"></a></li>
				  				  </ul>
				  				  <ul class="num" id="nums">
				  				  	<li>1</li>
				  				  	<li>2</li>
				  				  	<li>3</li>
				  				  	<li>4</li>
				  				  </ul>
				  </div>
				  
				  <!--疯狂购物  -->
				  <div id="creazy_buy">
					  <ul>
					  	<li><a href=""><img src="img/promote-1.jpg" alt=""></a></li>
					  	<li><a href="">这是一个商品，请大家浏览购买</a></li>
					  </ul>
					  <ul>
					  	<li><a href=""><img src="img/promote-2.jpg" alt=""></a></li>
					  	<li><a href="">这是一个商品，请大家浏览购买</a></li>
					  </ul>
					  <ul>
					  	<li><a href=""><img src="img/promote-3.jpg" alt=""></a></li>
					  	<li><a href="">请大家浏览购买</a></li>
					  </ul>
					  
					  <ul>
					  	<li><a href=""><img src="img/promote-1.jpg" alt=""></a></li>
					  	<li><a href="">这是一个商品，请大家浏览购买</a></li>
					  </ul>
					  <ul>
					  	<li><a href=""><img src="img/promote-2.jpg" alt=""></a></li>
					  	<li><a href="">这是一个商品，请大家浏览购买</a></li>
					  </ul>
					  <ul>
					  	<li><a href=""><img src="img/promote-3.jpg" alt=""></a></li>
					  	<li><a href="">请大家浏览购买</a></li>
					  </ul>
					  
					  <ul>
					  	<li><a href=""><img src="img/promote-1.jpg" alt=""></a></li>
					  	<li><a href="">这是一个商品，请大家浏览购买</a></li>
					  </ul>
					  <ul>
					  	<li><a href=""><img src="img/promote-2.jpg" alt=""></a></li>
					  	<li><a href="">这是一个商品，请大家浏览购买</a></li>
					  </ul>
					  <ul>
					  	<li><a href=""><img src="img/promote-3.jpg" alt=""></a></li>
					  	<li><a href="">请大家浏览购买</a></li>
					  </ul>
				  </div>
			  </div>
			  <div id="center_right">
				  <div id="center_right_t">
					  <!-- 顶部div -->
					  <div class="cover">
						  <ur>
						  	<li><a href="#"><img src="img/1.png" ></a></li>
						  	<li><a href="#">大学要求老师布置作业</a></li>
						  	<li><a href="#">大学要求同学完成作业</a></li>
						  	<li><a href="#">马上交作业</a></li>
						  	<li><a href="#">作业完成，老师评分</a></li>
						  </ur>
					  </div>
				  </div>
				  
				  <div id="center_right_m">
				  	  <!-- 中间div -->
					  <ul>
					  	<li><a href="#"><img src="img/show1.jpg" alt=""></a></li>
					  	<li><a href="#">这是一个产品</a></li>
					  </ul>
					  
					  <!-- 中间div -->
					  <ul>
					  	<li><a href="#"><img src="img/show2.jpg" alt=""></a></li>
					  	<li><a href="#">写前端的电脑</a></li>
					  </ul>
					  <!-- 中间div -->
					  <ul>
					  	<li><a href="#"><img src="img/show3.jpg" alt=""></a></li>
					  	<li><a href="#">写后端的电脑</a></li>
					  </ul>
					  <!-- 中间div -->
					  <ul>
					  	<li><a href="#"><img src="img/show4.jpg" alt=""></a></li>
					  	<li><a href="#">大数据分析的电脑</a></li>
					  </ul>
				  </div>
				  
				  <div id="center_right_b">
				  		 <!-- 低部div -->
						 <div id="center_right_b_t" class="computer">
							 <!-- 导航 -->
							 <ul>
							 	<li onclick="showTab('computer')"></li>
							 	<li onclick="showTab('phone')"></li>
							 </ul>
						 </div>
						 <div id="center_right_b_b">
							 <!-- 内容 -->
							 <div id="content_b">
								 <div id="computer" >
									 <form action="" method="">
									 	<p>品牌：<select>
										<option value="">联想</option>
										<option value="">华硕</option>
										<option value="">华为</option>
										</select></p>
										<p>尺寸：<select>
										<option value="">13寸</option>
										<option value="">14寸</option>
										<option value="">15寸</option>
										</select></p>
										<p>价格：<select>
										<option value="">4000以下</option>
										<option value="">5000以上</option>
										<option value="">10000以下</option>
										</select></p>
										<p id="bt"></p>
									 </form>
								 </div>
							 <div id="phone" style="display:  none;">
							 									 <form action="" method="">
							 									 	<p>运营商：<select>
							 										<option value="">联通</option>
							 										<option value="">电信</option>
							 										<option value="">移动</option>
							 										</select></p>
							 										<p>地　区：<select>
							 										<option value="">广东</option>
							 										<option value="">广西</option>
							 										<option value="">海南</option>
							 										</select></p>
							 										<p>面　值：<select>
							 										<option value="">50</option>
							 										<option value="">100</option>
							 										<option value="">200</option>
							 										</select></p>
							 										<p id="bt"></p>
							 									 </form>
							 </div>
							 </div>
						 </div>
				  </div>
			  </div>
		  </div>
			<div id="index_bottom">
			 <ul>
			 	<li><a href="#">友情链接：</a></li>
			 	<li><a href="#">淘宝&nbsp;&nbsp;</a></li>
			 	<li><a href="#">｜&nbsp;&nbsp;京东&nbsp;&nbsp;</a></li>
			 	<li><a href="#">｜&nbsp;&nbsp;拼多多&nbsp;&nbsp;</a></li>
			 	<li><a href="#">｜&nbsp;&nbsp;天猫&nbsp;&nbsp;</a></li>
			 	<li><a href="#">｜&nbsp;&nbsp;唯品会&nbsp;&nbsp;</a></li>
			 	<li><a href="#">｜&nbsp;&nbsp;苏宁&nbsp;&nbsp;</a></li>
			 	<li><a href="#">｜&nbsp;&nbsp;腾讯&nbsp;&nbsp;</a></li>
				<li><a href="#">｜&nbsp;&nbsp;goole&nbsp;&nbsp;</a></li>
				<li><a href="#">｜&nbsp;&nbsp;360&nbsp;&nbsp;</a></li>
				<li><a href="#">｜&nbsp;&nbsp;顺丰&nbsp;&nbsp;</a></li>
				<li><a href="#">｜&nbsp;&nbsp;唯品会&nbsp;&nbsp;</a></li>
				<li><a href="#">｜&nbsp;&nbsp;韵达&nbsp;&nbsp;</a></li>
			 	<li><a href="#">｜&nbsp;&nbsp;百度</a></li>
			 </ul>
			 <hr >
				 <div id="copy">
					 <p>xxxxxxxxxxxxxxx&copy;xxxxxxx</p>
					 <p>热线0668-8367311-0668-83673</p>
					 <p>备案号备案号备案号备案号备案号备案号</p>
					 <p><img src="img/img1.gif" alt=""><img src="img/img2.gif" alt=""><img src="img/img3.gif" alt=""><img src="img/img4.gif" alt=""></p>
				 </div>
			</div>
		 </div>
	<!-- 广告图片使用决定定位 -->
	<!-- 左边 -->
		 <link rel="stylesheet" type="text/css" href="css/index_ad.css"/>
		 <div id="ad_left">
			 <div>
				 <a href=""><img src="img/list3.jpg" alt=""></a>
				 <img src="img/close.gif" onclick="hiddenAd('ad_left')" alt="">
			 </div>
		 </div>
		 
		 <div id="ad_right">
		 			 <div>
		 				 <a href=""><img src="img/list4.jpg" alt=""></a>
		 				 <img src="img/close.gif" onclick="hiddenAd('ad_right')" alt="">
		 			 </div>
		 </div>
	
	</body>
</html>
